<template>
  <div class="app-container bg-gray">
    <el-card class="box-1">
      <div slot="header"><span>会员详情</span></div>
      <el-form ref="form" :model="form" :rules="formRules" label-width="160px">
        <el-form-item label="姓名">{{ form.name }}</el-form-item>
        <el-form-item label="性别" prop="sex">{{ form.sex }}</el-form-item>
        <el-form-item label="出生年月日">{{ form.birthday }}</el-form-item>
        <el-form-item label="籍贯">{{ form.native_place }}</el-form-item>
        <el-form-item label="民族">{{ form.nation }}</el-form-item>
        <el-form-item label="政治面貌">{{ form.political_outlook }}</el-form-item>
        <el-form-item label="学历">{{ form.education }}</el-form-item>
        <el-form-item label="身份证号码">{{ form.id_number }}</el-form-item>
        <el-form-item label="毕业院校">{{ form.school }}</el-form-item>
        <el-form-item label="专业">{{ form.major }}</el-form-item>
        <el-form-item label="入会推荐人">{{ form.recommender }}</el-form-item>
        <el-form-item label="头像">
          <el-image :src="form['avatar']?(form['avatar'].indexOf('https://')<0?ImageUrl+form['avatar']:form['avatar']):''" :preview-src-list="[form['avatar']?(form['avatar'].indexOf('https://')<0?ImageUrl+form['avatar']:form['avatar']):'']" style="width: 160px; height: 160px;"/>
        </el-form-item>
        <el-form-item label="企业名称">{{ form.enterprise_name }}</el-form-item>
        <el-form-item label="工作职务">{{ form.position }}</el-form-item>
        <el-form-item label="企业性质">{{ form.nature }}</el-form-item>
        <el-form-item label="企业地址">{{ form.provinceTxt && (form.provinceTxt+form.cityTxt+form.areaTxt+form.address) }}</el-form-item>
        <el-form-item label="主营业务">{{ form.main_business }}</el-form-item>
        <el-form-item label="是否高新科技企业">{{ form.new_high }}</el-form-item>
        <el-form-item label="所属行业">{{ form.industry }}</el-form-item>
        <el-form-item label="邮编">{{ form.zip_code }}</el-form-item>
        <el-form-item label="企业专利">{{ form.patent }}</el-form-item>
        <el-form-item label="手机号码">{{ form.mobile }}</el-form-item>
        <el-form-item label="QQ/微信号">{{ form.wechat }}</el-form-item>
        <el-form-item label="E-mail">{{ form.email }}</el-form-item>
        <el-form-item label="办公电话">{{ form.office_phone }}</el-form-item>
        <el-form-item label="企业网址">{{ form.website }}</el-form-item>
        <el-form-item label="传真">{{ form.fax }}</el-form-item>
        <el-form-item label="企业注册资金">{{ form.registered_capital }}</el-form-item>
        <el-form-item label="员工人数">{{ form.staff_number }}</el-form-item>
        <el-form-item label="类型">{{ form.industry_type_name }}</el-form-item>
        <el-form-item label="上一年度主营业额">{{ form.turnover }}</el-form-item>
        <el-form-item label="上一年度主纳税额">{{ form.tax_amount }}</el-form-item>
        <el-form-item label="工作简介">{{ form.job_brief }}</el-form-item>
        <el-form-item label="企业简介及发展情况">{{ form.company_profile }}</el-form-item>
        <div style="text-align:center">
          <el-button type="primary" @click="toModify">编辑用户</el-button>
          <el-button type="primary" @click="$router.back(-1)">返回</el-button>
        </div>
      </el-form>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // ImageUrl: this.$store.getters.serverUrl,
ImageUrl: '',

      form: {
        id: '',
        name: '',
        sex: '男',
        mobile: '',
        email: '',
        type: '',
        avatar: '',
        level: '',
        position: '',
        company: '',
        qq: '',
        source: '',
        project: '',
        remarks: '',
        certify_name: '',
        certify_no: '',
        create_time: '',
        enterprise_pic: '',
        password: '',
        confirmPass: '',
        status: 1
      },
      formRules: {
        name: [{ required: true, message: '请输入客户名', trigger: 'change' }]
      }
    }
  },
  created() {
    if (this.$route.query.id) {
      this.form.id = this.$route.query.id
      this.getMemberInfo(this.$route.query.id)
    }
  },
  methods: {
    /**
       *  获取用户信息
       *  接口:'member/detail/{id}'
       */
    getMemberInfo(id) {
      const url = 'vip/info/' + id
      this.$store.dispatch('GetConnect', { url }).then(res => {
        Object.assign(this.form, res.data)
      }).catch(e => {
        this.$message.error(e.msg + ',请刷新或联系管理员')
      })
    },

    // 跳转编辑
    toModify() {
      this.$router.push({
        path: '/member/create',
        query: { id: this.form.member_id }
      })
    }
  }
}
</script>

<style lang="scss" type="text/scss" scoped>
  @import '../../../styles/index.scss';
  .box-1 {
    max-width: 1000px;
    margin: 0 auto;
    > div span {
      font-size: 18px;
      font-weight: 600;
      padding: 0 10px;
    }
    .el-form {
      max-width: 900px;
      .title {
        font-weight: 600;
      }
      .remark {
        font-size: 13px;
        color: $textGray;
      }
      .el-button {
        @extend .bg-green;
        width: 20%;
        min-width: 160px;
      }
    }
  }
</style>
